<template>
    <div>
        <div class="detail-header clearfix">
            <div class="detail-header--lt fl">
                <img width="48px" :src="user.headimgurl" alt="">
                {{user.nickname}}
            </div>
            <div class="detail-header--rt fr">
                {{user.carModel}}
            </div>
        </div>
        <div class="merchant-detail merchant-cell-card">
                    <div class="clearfix">
                        <div class=" title-fz-color fl">{{order.name}}</div>
                        <div class="subtitle-fz-color fr">待处理</div>
                    </div>
                    <div class="clearfix">
                        <div class=" desc-fz-color fl">订单编号:{{order.orderNo}}</div>
                    </div>
                    <div class="clearfix">
                        <div class=" desc-fz-color fl">下单时间：{{order.payTime}}</div>
                        <div class="price-fz-color fr">￥{{order.clearPrice}}</div>
                    </div>
        </div>
        <div class="merchant-reason">
            <div class="merchant-reason-desc">
                申请退款原因
            </div>
            <div class="merchant-reason-content">
                <textarea readonly :value="order.content"></textarea>
            </div>
        </div>
        <div class="merchant-confirm" @click="cancelOrder">
            <div class="merchant-confirm-btn">
                确认退款
            </div>
        </div>
        <div class="merchant-contact">
            <a href="tel:010-64741971">
                如有疑问请联系客服：(010)-64741971
            </a>
        </div>
    </div>
</template>

<script>
let axios = require("axios");
let qs = require("qs");

export default {
  data() {
    return {
      order: {},
      user: {},
      token: "",
      orderNo: ""
    };
  },
  created() {
    let token = this.$route.params.token;
    let orderNo = this.$route.params.orderNo;
    this.token = token;
    this.orderNo = orderNo;
    this.getDetail(token, orderNo);
  },
  methods: {
    cancelOrder() {
      let self = this;
      this.$dialog.confirm({
        title: "确认退款",
        mes: "确认退款给用户?",
        opts: () => {
          self.enterOrder();
        }
      });
    },
    enterOrder() {
      let self = this;
      let data = {
        token: this.token,
        orderNo: this.orderNo
      };
      axios({
        method: "post",
        url: "/merchantcenter/refund",
        headers: {
          "Content-Type": "application/x-www-form-urlencoded"
        },
        data: qs.stringify(data)
      })
        .then(function(res) {
          if (res.data.errno != 200) {
            return self.$dialog.toast({
              mes: res.data.msg,
              timeout: 1500,
              icon: "error"
            });
          }
          self.$dialog.toast({
            mes: "退款成功",
            timeout: 1500,
            icon: "success"
          });
          self.$router.push({
            name: "Home"
          });
        })
    },
    getDetail(token, orderNo) {
      let self = this;
      axios({
        method: "get",
        url: "/merchantcenter/canceldetail",
        params: {
          token: token,
          orderNo: orderNo
        }
      }).then(function(res) {
        let data = res.data.data;
        self.order = data.order;
        self.user = data.user;
      });
    }
  }
};
</script>

<style>
</style>
